﻿<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=0">

    <title>Mobiscroll</title>

    <!-- jQuery Include -->
    <script src="http://code.jquery.com/jquery-1.11.1.min.js"></script>
    <!-- Mobiscroll JS and CSS Includes -->
    <script src="js/mobiscroll.core.js"></script>
    <script src="js/mobiscroll.frame.js"></script>
    <script src="js/mobiscroll.scroller.js"></script>
    <script src="js/mobiscroll.util.datetime.js"></script>
    <script src="js/mobiscroll.datetimebase.js"></script>
    <script src="js/mobiscroll.datetime.js"></script>
    <script src="js/mobiscroll.frame.android.js"></script>
    <script src="js/mobiscroll.frame.android-holo.js"></script>
    <script src="js/i18n/mobiscroll.i18n.zh.js"></script>
    <link href="css/mobiscroll.frame.css" rel="stylesheet" type="text/css" />
    <link href="css/mobiscroll.frame.android.css" rel="stylesheet" type="text/css" />
    <link href="css/mobiscroll.frame.android-holo.css" rel="stylesheet" type="text/css" />
    <link href="css/mobiscroll.scroller.css" rel="stylesheet" type="text/css" />
    <link href="css/mobiscroll.scroller.android.css" rel="stylesheet" type="text/css" />
    <link href="css/mobiscroll.scroller.android-holo.css" rel="stylesheet" type="text/css" />


    <script>
        $(function () {
                var demo, theme, mode, display, lang;

                $('#test1').val('').mobiscroll().date({
                    theme: 'android-holo',     // Specify theme like: theme: 'ios' or omit setting to use default
                    mode: mode,       // Specify scroller mode like: mode: 'mixed' or omit setting to use default
                    display: display, // Specify display mode like: display: 'bottom' or omit setting to use default
                    lang: 'zh',        // Specify language like: lang: 'pl' or omit setting to use default
                    defaultValue: new Date('1992-09-08'),
                    dateFormat: 'yyyy-MM-dd ',
                }).val('1992-09-08');


                // -------------------------------------------------------------------
                // Demo page code START, you can disregard this in your implementation
                $('.settings').on('change', function () {
                    demo = $('#demo').val();
                    theme = $('#theme').val() || $.mobiscroll.defaults.theme,
                            mode = "scroller",
                            display = "modal",
                            lang = $('#language').val();

                    $('.demo-cont').hide();
                    $("#demo_cont_" + demo).show();

                    init();
                });
                // Demo page code END
                // -------------------------------------------------------------------

                // Date demo initialization


        });
    </script>
</head>

<body><input type='text' id='test1' value='1992-09-08'/>

</body>
</html>
